<template>
	<view class="p-20px pb-120px">
		<view class=" flex flex-x-between">
			<view>分组管理</view>
			<uv-button type="primary" text="+ 新增分组" size="small" shape="circle" color="black"
				@click="addGrouping"></uv-button>
		</view>

		<view class="p-20px mt-20px bg-white rounded-20px">
			<view class="flex flex-x-between flex-y-center">
				<view class="flex flex-y-center">
					<text class="w-40px h-40px rounded border text-24px flex flex-x-center flex-y-center">01</text>
					<text class="mx-20px">江南地区</text>
				</view>
				<view class="text-24px flex">
					<uv-button type="primary" text="修改" size="mini" @click="gotoEditGrouping"></uv-button>
				</view>
			</view>

			<uv-line margin="20rpx 0" length="100%"></uv-line>

			<view class="flex flex-x-between text-28px leading-40px">
				<view class="w-1-4 text-center">
					<view>成交</view>
					<text>156</text>
				</view>
				<view class="w-1-4 text-center">
					<view>成交额</view>
					<text>56</text>
				</view>
				<view class="w-1-4 text-center">
					<view>浏览</view>
					<text>41</text>
				</view>
				<view class="w-1-4 text-center">
					<view>转发</view>
					<text>2331</text>
				</view>
			</view>
		</view>

		<BackWorkSpace></BackWorkSpace>
	</view>
</template>

<script setup name="Grouping">
	import {
		ref,
		reactive,
		onMounted,
	} from 'vue';
	import BackWorkSpace from '@/components/BackWorkSpace.vue'

	const actionsRef = ref()
	const state = reactive({
		search: '',
	})

	const addGrouping = () => {
		uni.$uv.route({
			url: '/pages/Grouping/AddEdit/AddEdit',
			params: {
				pageType: 0
			}
		})
	}

	const gotoEditGrouping = () => {
		uni.$uv.route({
			url: '/pages/Grouping/AddEdit/AddEdit',
			params: {
				pageType: 1
			}
		})
	}
</script>

<style lang="scss">
	page {
		background: rgb(244, 243, 248);
	}

	.border {
		border: 1px solid #dedede;
	}
</style>